1.使用百度AI识图api,进行识图

2023-08-30 16:09| 来源: 网络整理| 查看: 265

1.操作步骤

1.利用uni.chooseImage的Api方法进行绑定一张图片

2.将绑定好的图片进行base64转换（在进行uniapp转换之前需要npm一下，下载image-tools）

ps:在百度识图api请求前需要进行proxy代理解决跨域需求

3.获取高德api的Access-token

4.将获取到的Access-token和base64图片进行百度识图api的请求验证

2.详解拆分

1.下载引入转换base64的模块化组件

1.npm i image-tools --save //下载

2.使用：import {pathToBase64,base64ToPath} from 'image-tools'

使用转化base64

import { pathToBase64, base64ToPath } from 'image-tools'

1.利用uni.chooseImage的Api方法进行绑定一张图片

2.将绑定好的图片进行base64转换

btnTankptoto() { uni.chooseImage({ count: 1, //默认9 success: (res) => { console.log(res) //将获取到的图片保存 this.imagpath = res.tempFilePaths[0] //将获取到的图片利用npm引入的方法进行转换成base64 pathToBase64(res.tempFilePaths[0]) .then(base64 => { console.log(base64) this.baseImageList = base64 console.log('11', this.baseImageList) //成功之后调用识图api方法 this.imgclassidiy(this.baseImageList) }) .catch(error => { console.error(error) }) }, }) },

ps：跨域请求操作

uni-app的跨域请求proxy代理在manifest.json里面的源码视图里面写入

在进行百度识别api之前要跨域

3.获取高德api的Access-token

4.将获取到的Access-token和base64图片进行百度识图api的请求验证

PS:KEY API 和 secret key 用自己创建的

url:'/baiduApigrant_type=client_credentials&client_id=2Wv2BFOVjRAmbVHAXrr4vt&client_secret=vmTpTUL2gNBRRWP0fHq5t0fhx5Bl1w',

async imgclassidiy(a) { // key api： 2Wv2BFOVjRAmbVzxHAXrr4vt // Secret Key： vmTpTUL2gNBRRWP0fHq5t0fhx925Bl1w; // 通过请求方式获取“Access Token获取 let res = await uni.request({ header: { 'Content-Type': 'application/x-www-form-urlencoded' }, url: '/baiduApi?grant_type=client_credentials&client_id=2Wv2BFOVjRAVzxHAXrr4vt&client_secret=vmTpTUL2gNBRRWP0fHq5t0fh25Bl1w', }) console.log('zz', res) let access_token = res[1].data.access_token //使用百度识图api的请求方式进行识图 let data = await uni.request({ url: 'https://aip.baidubce.com/rest/2.0/image-classify/v2/advanced_general', method: 'POST', header: { 'Content-Type': 'application/x-www-form-urlencoded' }, data: { access_token: access_token, //access.token，获取到的 image: a, //base64图片 baike_num: "1" //说明，详情，数字代表详情只显示几条数据的 }, }) console.log('sj', data) this.imgspath = data[1].data.result console.log(this.imgspath) //调用弹出层 this.toggle() }, } 3.完整代码拍照或者选择照片 {{item.keyword }} import { pathToBase64, base64ToPath } from 'image-tools' export default { data() { return { imagpath: '', //图片 imgspath: [], //保存查询到的信息 baseImageList: [], //存储图片base64，用于上传后端 } }, onLoad() { }, methods: { //弹出层 toggle(type) { this.$refs.popup.open() }, //1 从拍照或者相册获取一张照片 btnTankptoto() { uni.chooseImage({ count: 1, //默认9 success: (res) => { console.log(res) //将获取到的图片保存 this.imagpath = res.tempFilePaths[0] //将获取到的图片利用npm引入的方法进行转换成base64 pathToBase64(res.tempFilePaths[0]) .then(base64 => { console.log(base64) this.baseImageList = base64 console.log('11', this.baseImageList) //成功之后调用识图api方法 this.imgclassidiy(this.baseImageList) }) .catch(error => { console.error(error) }) }, }) }, //请求百度识图接口部分 async imgclassidiy(a) { //自己的 key api： 2Wv2BFOVjRAmbVzxHAXrr4vt //自己的 Secret Key： vmTpTUL2gNBRRWP0fHq5t0fhx925Bl1w; // 通过请求方式获取“Access Token获取 let res = await uni.request({ header: { 'Content-Type': 'application/x-www-form-urlencoded' }, //获取toke的地址 url: '/baiduApi?grant_type=client_credentials&client_id=2Wv2BFOVjRAmbVzxHrr4vt&client_secret=vmTpTUL2gNBRRWP0fHq5t0fhx9Bl1w', }) console.log('zz', res) let access_token = res[1].data.access_token //使用百度识图api的请求方式进行识图 let data = await uni.request({ url: 'https://aip.baidubce.com/rest/2.0/image-classify/v2/advanced_general', method: 'POST', header: { 'Content-Type': 'application/x-www-form-urlencoded' }, data: { access_token: access_token, //access.token，获取到的 image: a, //base64图片 baike_num: "1" //说明，详情，数字代表详情只显示几条数据的 }, }) console.log('sj', data) this.imgspath = data[1].data.result console.log(this.imgspath) //调用弹出层 this.toggle() }, } } .popup-content { margin: 0 auto; text-align: center; } 效果图

栓Q

【本文地址】

公司简介

联系我们